doctype html
html
include ./includes/head.jade

body
	include ./includes/header.jade
	.container
		.row
			p 水平排列
			.row.show-grid
				.col-md-1 .col-md-1
				.col-md-1 .col-md-1
				.col-md-1 .col-md-1
				.col-md-1 .col-md-1
				.col-md-1 .col-md-1
				.col-md-1 .col-md-1
				.col-md-1 .col-md-1
			.row.show-grid
				.col-md-8 .col-md-8
				.col-md-4 .col-md-4
			.row.show-grid
				.col-md-6 .col-md-6
				.col-md-6 .col-md-6
			.row.show-grid
				.col-lg-6 .col-lg-6
				.col-lg-6 .col-lg-6
			.row.show-grid
				.col-lg-6.col-lg-offset-1 .col-lg-offset-1
		.row
			dl.dl-horizontal
				dt test for dt
				dd value for dd
		.row
			p table
			table.table.table-striped.table-hover.table-condensed.table-bordered
				thead
					tr
						th 第一列
						th 第二列
				tbody
					tr.success
						td 1
						td 2
					tr
						td 1
						td 2
					tr
						td 1
						td 2
					tr
						td 1
						td 2
		.row
			p 表单 form
			form.form-inline
				.form-group
					label(for="name") 用户名字：
					input#name.form-control(type="text")

				.form-group
					label(for="password") 用户密码：
					input#password.form-control(type="password")
				.form-group
					button.btn.btn-success(type="submit") 提交
			p form 水平排列
			form.form-horizontal
				.form-group
					label.col-lg-2(for="name") 用户名字：
					.col-lg-10
						input#name.form-control(type="text")

				.form-group
					label.col-lg-2(for="password") 用户密码：
					.col-lg-10
						input#password.form-control(type="password")
				.form-group
					.col-lg-offset-2.col-lg-10
						button.btn.btn-success(type="submit") 提交
		.row
			p 控件
			input.form-control(placeholder="Test for input")
			textarea.form-control(placeholder="Test for textarea", row=3)
			.checkbox
				label.checkbox-inline.
					<input type="checkbox">
					option one
				label.checkbox-inline.
					<input type="checkbox">
					option one
			p has-success
			.has-success
				.input-group
					span.input-group-addon @	
					input.form-control(placeholder="Has success")
			img.img-rounded(src="", alt="test")
		.row
			p 字体
			button.btn.btn-default(aria-label="Left Align")
				span.glyphicon.glyphicon-align-left(arig-label="Left Align")
				
			button.btn.btn-default.btn-lg(aria-label="Left Align")
				span.glyphicon.glyphicon-star(arig-hiden="true")  star
		.row
			p dropdown
			.dropdown
				button#dropdownMenu1.btn.btn-default.dropdown-toggle(data-toggle="dropdown", aria-expanded="true").
					Dropdown
					<span class="caret"></span>
				ul.dropdown-menu(role="menu" aria-labelledby="dropdownMenu1")
					li(role="presentation")
						a(role="menuitem", tabindex="-1", href="#") Action
					li(role="presentation")
						a(role="menuitem", tabindex="-1", href="#") Action1
					li(role="presentation")
						a(role="menuitem", tabindex="-1", href="#") Action2
					li.divider(role="presentation")
					li.disabled(role="presentation")
						a(role="menuitem", tabindex="-1", href="#") Action4
		.row
			.btn-group(role="group")
				button.btn.btn-default.btn-lg Left
				button.btn.btn-default Middle
				button.btn.btn-default Right
		.row
			.btn-group.btn-group-lg(role="group")
				button.btn.btn-default.btn-lg Left
				button.btn.btn-default Middle
				button.btn.btn-default Right
		.row
			.btn-group.btn-group-justified(role="group")
				.btn-group
					button.btn.btn-default Left
				.btn-group
					button.btn.btn-default Middle
				.btn-group
					button.btn.btn-default Right
		.row
			p 导航条
			ul.nav.nav-tabs
				li.active(role="presentation")
					a(href="#") Home
				li(role="presentation")
					a(href="#") test1
				li(role="presentation")
					a(href="#") test2
		.row
			.jumbotron
				h1 Hello World!
				p TTTTTTT TTTTTTTT
				p
					a.btn.btn-primary.btn-lg(href="#" role="button") Learn more
		.row
			.jumbotron
				.container
					h1 Hello World!
					p TTTTTTT TTTTTTTT
					p
						a.btn.btn-primary.btn-lg(href="#" role="button") Learn more
		.row
			p Page Header
			.page-header
				h1 Example page header

		.row
			p progress
			.progress
				.progress-bar.progress-bar-sucess(style="width:30%")
					span.sr-only 30% complete
		.row
			ul.list-group
				li.list-group-item ttt
					span.badge 3
				li.list-group-item ttt
				li.list-group-item ttt
				li.list-group-item ttt
				li.list-group-item ttt
		.row
			p next
		.row
			p next
		.row
			p next
		.row
			p next
		.row
			p next
		.row
			p next


	include ./includes/footer.jade